<%@ page language="java" import="java.util.*,com.opensymphony.xwork2.util.*,com.base.service.AddressService" 
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>  

<!doctype html>
<html lang="zh-hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/main.css">    
<script src="lib/jquery-2.1.1.min.js"></script>
<script src="lib/bootstrap/js/bootstrap.min.js"></script>
<title>HIFO</title>
<!-- 省市区 -->
<script type="text/javascript">
function tijiao(){
	//$("#phones").val($("#phone1").val()+"|"+$("#phone2").val()+"|"+$("#phone3").val());	//多个电话替换
	
	$("#phones").val($("#phone0").val());
	document.form1.submit();
};


function select1() {
$.ajax(
{
    type: "post",
    url: "getProvince",
    //data: { "code": "" },
    success: function (msg) {
    	$("#S1").append("<option value="  + "0>" + "</option>");
        for (var i = 0; i < msg.length; i++) {
            $("#S1").append("<option value='" +msg[i].provinceId+ "'>" + msg[i].province + "</option>");
        }
        select2();
        
    }
})
};

function select2() {
$("#S2").html("");
$.ajax(
{
    type: "post",
    url: "getCity",
    data: {"code":$('#S1').val()},
    success: function (msg) {
    	$("#S2").append("<option value="  + "0>" + "</option>");
        for (var i = 0; i < msg.length; i++) {
            $("#S2").append("<option value=" + msg[i].cityId + ">" + msg[i].city + "</option>");
        }
        select3();
    }
})
};
        
function select3() {
$("#S3").html("");
$.ajax(
{
    type: "post",
    url: "getArea",
    data: { "code":$('#S2').val()},
    success: function (msg) {
    	$("#S3").append("<option value="  + "0>" + "</option>");
        for (var i = 0; i < msg.length; i++) {
            $("#S3").append("<option value=" + msg[i].areaId + ">" + msg[i].area+ "</option>");
        }
        $("#myadd").val($("#S1 option:selected").text()+"|"+$("#S2 option:selected").text()+"|"+$("#S3 option:selected").text());
        $("#myaddcode").val($("#S1").val()+"|"+$("#S2").val()+"|"+$("#S3").val());
    }
})
};

function writeArea(){
	$("#myadd").val($("#S1 option:selected").text()+"|"+$("#S2 option:selected").text()+"|"+$("#S3 option:selected").text());
	$("#myaddcode").val($("#S1").val()+"|"+$("#S2").val()+"|"+$("#S3").val());
	//$("#myaddcode").val($("#S1").value+$("#S2").value+$("#S3").value);
	//alert($("#S3").val());
};

$(function () {
select1();
$('#S1').bind("change", select2);
$('#S2').bind("change", select3);
$('#S3').bind("change", writeArea);
});


</script>
</head>
<body>
<%@ include file="_daohang.jsp" %>	
<form name="form1" action="kh_merge" method ="post">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h5 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
基本信息
</a>
</h5>
</div>
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body khdetail">
           
<!-- #################基本信息 START ###################  -->
<div class="form-group">  

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>
<input type="text" class="form-control" name="phone1Id" placeholder="phone1Id" value="<s:property value="phone1Id"/>">
<input type="text" class="form-control" id="phone1" name="phone1" placeholder="电话1" value="<s:property value="phone1"/>">
<div class="input-group-addon"><img class="home" src="images/add.png"></div>
</div>

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>
<input type="text" class="form-control" name="phone2Id" placeholder="phone2Id" value="<s:property value="phone2Id"/>">
<input type="text" class="form-control" id="phone2" name="phone2"  placeholder="电话2" value="<s:property value="phone2"/>">
<div class="input-group-addon"><img class="home" src="images/add.png"></div>
</div>

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>
<input type="text" class="form-control" name="phone3Id" placeholder="phone3Id" value="<s:property value="phone3Id"/>">
<input type="text" class="form-control" id="phone3" name="phone3" placeholder="电话3" value="<s:property value="phone3"/>">
<div class="input-group-addon"><img class="home" src="images/add.png"></div>
</div>

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/name.png"></div>
<input type="text" class="form-control" id="name" name="name" placeholder="姓名" value="<s:property value="name"/>">
</div>

<!-- 地址显示  -->
<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/zanwei.png"></div>

<input type="text" class="form-control" placeholder="地址名称|分隔" value="<s:property value="addNames"/>" >	

<!-- 地址实际值 cid type tip隐藏域  -->
<div id="_hide" class="">
<!-- <div id="_hide" class="hide"> --> 
	<input type="text" name="cid" id="cid" placeholder="cid" value="<s:property value="cid"/>">
	<input type="text" id="tip" placeholder="tip" value="<s:property value="tip"/>">
	<!-- test start -->
	<input type="text"  value="<s:property value="clientFilter.checkedResult"/>">
	<input type="text"  value="<s:property value="clientFilter.checked"/>">
	<!-- test end -->
	<input type="text" name="addCodes" id="myaddcode" placeholder="地址值|分隔" value="<s:property value="addCodes"/>" >	
	
		
	<input type="text" id="myadd" name="addNames"  placeholder="地址" >
</div><!-- _hide -->

</div>    



            
<div class="input-group">
<div class="input-group-addon">省&nbsp;</div>
<select class="form-control" id="S1" >
	
</select>
<!--<div class="input-group-addon"><img class="home" src="images/zanwei.png"></div>-->
</div>
    
<div class="input-group">
<div class="input-group-addon">市&nbsp;</div>
<select class="form-control" id="S2" >

</select>
</div>
    
<div class="input-group">
<div class="input-group-addon">区&nbsp;</div>
<select class="form-control" id="S3" >

</select>
</div>
    
    
<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/memo.png"></div>
<textarea class="form-control" rows="3" cols="10"></textarea>
</div>
 

<div class="input-group">
<span><s:property value="tip"/></span>
</div>    
    

  
</div><!--form-group-->
<!-- ################基本信息 END   ###########################       -->           
           
           
           
           
           
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingTwo">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
扩展信息
</a>
</h4>
</div>
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="panel-body khdetail">


<!-- 扩展信息 START   #####################   -->


<!--挖掘机品牌--><div><hr>现有挖机品牌</div>
<div class="form-group">
<s:checkboxlist name="chose1" list="{'卡特','小松','日立','斗山','现代','沃尔沃','神钢','其他'}" value="#request.chose1"/> <br/>
</div>

<!--装载机品牌--><div><hr>现有装机品牌</div>
<div class="form-group">
<s:checkboxlist name="chose2" list="{'柳工','临工','成工','龙工','厦工','山工','其他'}" value="#request.chose2"/> <br/>
</div>

<!--欲购设备类型--><div><hr>欲购设备类型</div>		
<div class="form-group">
<s:checkboxlist name="chose3" list="{'挖掘机','装载机','其他'}" value="#request.chose3"/> <br/>
</div>

<!--客户类型--><div><hr>客户分类</div>
<div class="container"><div class="row">

<s:radio name="chose4" list="#{'a':'无&nbsp;','b':'作废&chi;','c':'标记&clubs;','d':'一般&diams;','e':'重要&spades;'}" listKey="key" listValue="value" />

</div></div><!--row--container-->

<!--给赞--><div><hr>经纪人给赞</div>
<div class="container"><div class="row">
<s:radio name="chose5" list="#{'a':'无&nbsp;','b':'赞&hearts;'}" listKey="key" listValue="value" />
</div></div><!--row--container-->


<!--欲购时间--><div><hr>预计购机时间</div>
<div class="container"><div class="row">
<div class="col-xs-12">预计达成销售时间为：2015/03/12</div>
	<s:select name="chose6"  list="#{0:'无',1:'一月内',2:'二月内',3:'三月内'
		,4:'四月内',5:'五月内',6:'半年内',12:'一年内'}" listKey="key" listValue="value" 
	/>
</div></div><!--row--container-->



<!--  扩展信息 END    ####################  -->

</div></div>

<div class="container navbar-fixed-bottom">
<div class="row">
<!--<div class="col-xs-4"><button type="button" class="btn btn-success">新建</button></div>-->
<div class="col-xs-4"></div>
<!--<div class="col-xs-4"><button type="button" class="btn btn-success">暂存</button></div>-->
<div class="col-xs-8">
    <button type="button" class="btn btn-info center-block" data-toggle="modal" data-target="#myModal">提交</button>
</div>
</div>
</div>

</div></div>   				
				
<!-- 按钮触发模态框 START-->    
<!--
<div class="container navbar-fixed-bottom">
<button type="button" class="btn btn-info center-block" data-toggle="modal" data-target="#myModal">提交</button>
</div>
-->
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<!--<h4 class="modal-title" id="myModalLabel">确认修改</h4>-->
</div>
<!--此处可以加入很多信息-->
<div class="modal-body">
	<!-- <input type="button" class="btn btn-primary" value="确定提交"  onClick="javascript:document.form1.submit()"  /> -->   
    <input type="button" class="btn btn-primary" value="确定提交"  onClick="tijiao()"  />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
$(function () { $('#myModal').modal({
	keyboard:false;
})});
</script>
<!--按钮触发模态框 END -->

</form>				

</body>
</html>